<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <style>
        .h{
         background-color:red;
         margin-left: 2cm;
         margin-right: 2cm;
        }
        div{
         border:1px solid red;
         padding:200px;
        }
        #crosshair{
			cursor: crosshair;
		}
		#pointer{
			cursor: pointer;
		}
		#move{
			cursor: move;
		}
		#text{
			cursor: text;
		}
		#wait{
			cursor: wait;
		}
		#help{
			cursor: help;
		}
    </style>
</head>
<body>
<header>
    <div class="h" style="color:green" >
        <p  align="center">这里是首页大图的位置<br></p>
    </div>
    <p align="center"><img src="../img/首图.jpg" alt="首页" title="首页大图" width="" align="lie"></p>
</header>
<article>
    <ul>
        <li>
            <img src="../img/首图.jpg" alt="首页" title="首页">
            <p>这是一段演示用文字</p>
        </li>
        <li>
            <img src="../img/首图.jpg" alt="首页" title="首页">
            <p>这是一段演示用文字</p>
        </li>
        <li>
            <img src="../img/首图.jpg" alt="首页" title="首页">
            <p>这是一段演示用文字</p>
        </li>
    </ul>
</article>
<article>
    <center>

    </center>
</article>
<article>
    <div>
        <p>这是一段演示用文字！</p>
    </div>
    <br>
    <div>
        <p>这是一段演示用文字！</p>
    </div>
</article>
<article>
    <p>默认样式</p>
    <p id="crosshair">十字线</p>
    <p id="pointer">一只小手</p>
    <p id="move">可被移动</p>
    <p id="text">指示文本</p>
    <p id="wait">表示程序正忙</p>
    <p id="help">表示可用帮助</p>
</article>
</body>
</html>